@extends('../manage.layout')
@section('link')
    <!-- Date Picker -->
    <link rel="stylesheet" href="/plugin/AdminLTE-2.3.11/plugins/datepicker/datepicker3.css">
    <!-- Daterange picker -->
    <link rel="stylesheet" href="/plugin/AdminLTE-2.3.11/plugins/daterangepicker/daterangepicker.css">
    <link rel="stylesheet" href="/plugin/Font-Awesome-4.7.0/css/font-awesome.min.css">
    <style>
        .h {
            height: 30px;
            margin-right: -4px;
        }
        .st {
            border: 1px solid #d2d6de;
            padding-left: 8px;
        }
        .dis {
            display: none;
        }
    </style>
@endsection
@section('content')
    <!-- Header -->
    <section class="content-header">
        <h1>
            客户管理
            <small>客户列表</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="/manage"><i class="fa fa-dashboard"></i>仪表盘</a></li>
            <li class="active">客户列表</li>
        </ol>
    </section>
    <!-- Main -->
    <section class="content animated fadeInRight">
        <div class="row">
            <div class="col-md-12">
                <div class="box box-primary">
                    <div class="box-header with-border">
                        <form action="/manage/about" method="get">
                            @include('manage.search')
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <form action="client/task" method="post">
                {{ csrf_field() }}
            <div class="col-md-12">
                <div class="box">
                    <div class="box-header with-border">
                        <a style="float: left" href="client/create" class="btn btn-default btn-sm">添加客户</a><a style="float: left;margin-left: 10px" onclick="task()" class="btn btn-default btn-sm">分配任务</a><div style="float: left;margin-left: 10px" id="task" class="dis" ><input type="text" name="task" width="200px" required placeholder="请输入任务名称">&nbsp;&nbsp;&nbsp;&nbsp;<button type="submit" class="btn btn-default btn-sm">确认</button></div>
                    </div>
                    <div class="box-body">

                        <table class="table table-bordered table-hover table-striped">
                            <tr>
                                <th><input type="checkbox" id="all" value="">全选</th>
                                @foreach($field as $d => $f)
                                    <th title="{{ $d }}">{{ $f }}<i id="{{ $d }}" onclick="order(this)" class="fa fa-sort"></i></th>
                                @endforeach
                                <th>操作</th>
                            </tr>
                            @foreach($data as $value)
                                <tr>
                                    <td><input type="checkbox" name="operation[]" value="{{ $value['id'] }}"></td>
                                    <td>{{ $value['id'] }}</td>
                                    <td style="max-width: 90px">{{ $value['create_time'] }}</td>
                                    <td style="max-width: 90px">{{ $value['update_time'] }}</td>
                                    {{--<td title="{{ $value['create_user'] }}">{{ App\Model\Manage::find($value['create_user'])['username'] }}</td>--}}
                                    {{--<td title="{{ $value['update_user'] }}">{{ App\Model\Manage::find($value['update_user'])['username'] }}</td>--}}
                                    <td>{{ $value['rank'] }}</td>
                                    <td>{{ $value['name'] }}</td>
                                    <td>{{ $value['gender'] }}</td>
                                    <td>{{ $value['age'] }}</td>
                                    <td>{{ $value['phone'] }}</td>
                                    <td>{{ $value['email'] }}</td>
                                    <td>@if(!empty($value['date'])){{ $value['project'] }}@endif</td>
                                    <td>{{ $value['date'] }}</td>
                                    <td>{{ $value['address'] }}</td>
                                    <td>
                                        @if($value['status'] == 0)<span class="label label-warning">已禁用</span>
                                        @else<span class="label label-success">已启用</span>
                                        @endif
                                    </td>
                                    <td>
                                        <a href="client/{{ $value['id'] }}/edit"><span class="btn btn-primary btn-xs">更改</span></a>
                                        @if($value['status'] == 1)
                                            <a class="btn btn-warning btn-xs" href="javascript:status('{{ $value['id'] }}',0)">禁用<a>
                                        @elseif($value['status'] == 0)
                                            <a class="btn btn-success btn-xs" href="javascript:status('{{ $value['id'] }}',1)">启用<a>
                                        @endif
                                        <a href="javascript:delSubscribe({{ $value['id'] }})"><span class="btn btn-danger btn-xs">删除</span></a>
                                    </td>
                                </tr>
                            @endforeach
                        </table>

                        <div id="type" style="display: none">{{ $type }}</div>
                        <div id="code" style="display: none">{{ $code }}</div>
                    </div>
                    <div class="box-footer">
                        <div style="text-align: center">{{ $data->appends(['check_time'=>$check_time,'category'=>$category,'create_time'=>$time,'keyword'=>$keyword,'type'=>$type,'code'=>$code])->links() }}</div>
                    </div>
                </div>
            </div>
            </form>
        </div>
    </section>
    <!-- /.content -->
@endsection
@section('script')
    <!-- daterangepicker -->
    <script src="/plugin/AdminLTE-2.3.11/thirdparty/js/moment.min.js"></script>
    <script src="/plugin/AdminLTE-2.3.11/plugins/daterangepicker/daterangepicker.js"></script>
    <!-- datepicker -->
    <script src="/plugin/AdminLTE-2.3.11/plugins/datepicker/bootstrap-datepicker.js"></script>
    <!--layer-->
    <script src="/plugin/layer-v3.0.3/layer/layer.js"></script>
    <script src="/js/manage/date_range.js"></script>
    <script>
        function task() {
            $('#task').removeClass('dis');
        }


        function delSubscribe(id) {
            layer.confirm('删除后不可恢复，是否继续?', {
                btn:['确定','取消']
            },function() {
                $.ajax({
                    url: '/manage/client/delete',
                    type: "GET",
                    data: {id:id},
                    dataType: "json",
                    success: function(res) {
                        console.log(res);
                        if(res.code == 100) {
                            window.location.href = "/manage/client";
                            layer.msg(res.msg)
                        }
                        else {
                            layer.msg(res.msg)
                        }
                    }
                });
            });
        }
        //禁用,启用
        function status(id,status) {
            console.log(id);
            $.ajax({
                url: '/manage/client/status',
                type: "GET",
                data: {id:id,status:status},
                dataType: "json",
                success: function(res) {
                    console.log(res);
                    if(res.code == 100) {
                        window.location.href=window.location.href;
                        layer.msg(res.msg, {time:1500, icon:6})
                    }
                    else {
                        layer.msg(res.msg, {time:1500, icon:5})
                    }
                },
                error:function(){
                    alert('ERROR');
                }
            });
        }

        //获取排序状态，改变图标
        $(function(){
            var c = $('#code').text();
            var t = $('#type').text();
            if(c == 0) {
                $('#'+t).attr("class", "fa fa-sort-asc");
            }
            if(c == 1) {
                $('#'+t).attr("class", "fa fa-sort-desc");
            }
        });

        //排序
        function order(node) {
            var type = null;
            var str = $(node).attr('class');
            if(str.indexOf('asc')!=-1) {
                $(node).attr("class", "fa fa-sort-desc");
                type = node.parentNode;
                data = {type:type.title,code:1};
                console.log(data);
                window.location.href = '/manage/client?type='+type.title+'&code=1';
            }
            else {
                $(node).attr("class", "fa fa-sort-asc");
                type = node.parentNode;
                data = {type:type.title,code:0};
                console.log(data);
                window.location.href = '/manage/client?type='+type.title+'&code=0';
            }

        }

        $("#all").change(function() {
            if($("#all").is(':checked') == true) {
                $("input[type='checkbox']").attr("checked", true);
            }
            if($("#all").is(':checked') == false) {
                $("input[type='checkbox']").attr("checked", false);
            }
        });

    </script>
@endsection
